import React from 'react';

// 定义路由规则
import { NavLink, Route, Switch, Redirect } from 'react-router-dom';
import Home from './Home';
import Category from './Category';
import Detail from './Detail';
const Father = () => {
    return (
        <div>
            {/* 声明式导航 */}
            <p>
                <NavLink to='/home'>首页</NavLink>
                <NavLink to='/category'>分类</NavLink>
            </p>
            {/* 定义路由规则和坑 */}
            <Switch>
                <Route path='/home' component={Home}></Route>
                <Route path='/category' component={Category}></Route>
                <Route path='/detail/:id?' component={Detail}></Route>
                <Redirect from='/' to='/home' exact></Redirect>
            </Switch>
        </div>
    );
}

export default Father;
